<template>
	<div class="aid">
		<div class="base">
			<p class="fixed-top">
				<span>邀请成员加入学生组织</span>
				<a-icon @click="closeFunction" type="close" />
			</p>
			<div class="main" id="new_message">
				<a-form :form="form" @submit="handleSubmit">
					<a-form-item label="选择成员" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
						<a-select showSearch optionFilterProp="children" style="width: 100%" placeholder="请输入学号进行搜索" v-decorator="['userNo',{ rules: [{ required: true, message: '请选择学生组织成员' }] }]"
						          @search="fetchUser" :filterOption="filterOption"
						>
						  <a-spin v-if="fetching" slot="notFoundContent" size="small" />
						  <a-select-option v-for="(item, index) in userList" :key="item.UserNo">{{ item.UserNo }}&nbsp;|&nbsp;{{ item.Name }}</a-select-option>
						</a-select>
					</a-form-item>
					<a-form-item class="fixed-bottom">
						<a-button type="primary" html-type="submit" class="btn2">提交</a-button>
					</a-form-item>
				</a-form>
			</div>
		</div>
	</div>
</template>
<script>
	import Cache from '@/utils/cache'
	import {
		UserDoInviteUser,
		GetUserClubMember,
		GetUserList
	} from '@/api/follow'
	export default {
		props: {
			ID: String,
			time:null
		},
		watch: {
				time: {
					handler(text) {
					},
					immediate: true
				},
			},
		data() {
			return {
				formLayout: 'horizontal',
				form: this.$form.createForm(this, {
					name: 'coordinated'
				}),
				memberList:[],
				fetching:false,
				userList:[]
			}
		},
		async created() {
			// await this.GetConfirmState()
		},
		methods: {
			async fetchUser(value) {
				this.fetching = true
				let myReg = /^[^a-zA-Z]+$/
				if (value && value.length > 1) {
					let data = {}
					data.userNo = value
					data.top = 1
					let res = await GetUserList(data)
					this.fetching = false
					this.userList = res.data.data
				}
			},
			radioOnChange(e) {
			},
			filterOption(input, option) {
				return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
			},
			closeFunction(data) {
				this.worklist = []
				this.form.resetFields();
				this.$emit('closeFun',data)
			},
			roleChange(value) {},
			departmentChange(value) {},
			handleSubmit(e) {
				this.form.validateFields(async (err, values) => {
					if (!err) {
						let data = {}
						data.clubID = this.ID
						data.UserNo = values.userNo
						let res = await UserDoInviteUser(data)
						if (res.data.code === 0) {
							this.$message.success(res.data.msg)
							this.closeFunction(1)
						} else {
							this.$message.error(res.data.msg)
						}
					}
				});

			}
		}
	}
</script>

<style lang="less" scoped>
	/deep/.ant-form {
		margin-top: 50px;
		padding-bottom: 80px;
	}
	/deep/.ant-form-item {
		margin: 20px 50px;
	}
	/deep/.ant-form-item-label {
		width: 100px;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		text-align: right;
	}
		
	/deep/.ant-form-item-control-wrapper {
		flex: 1;
	}
		
	/deep/textarea {
		height: 140px;
	}
</style>
